/**
 * @description  : 待办中文书的附件组件
 * @descriptionDetail : 待办中文书的附件组件
 * @copyright    : 浙江烟草
 * @author       : mc
 * @create       : 2022-11-05 09:45:09
 */
<template>
  <view class="page">
    <view class="main-content" v-for="(item,index) in fileList" :key="index">
      <u-row>
        <u-col :span="1.2" style="text-align:right;">
          <u-icon name="attach" width="42" height="48" color="#2979ff" size="34"></u-icon>
        </u-col>
        <u-col :span="6.8" style="line-height: normal;">
          <span @click="viewFile(item)">{{ item.fileName }}</span>
        </u-col>
        <u-col :span="3" style="text-align:right;color:#3381ff">
          <span @click="download(item)">点击下载</span>
        </u-col>
        <u-col :span="1">
          <u-icon name="download" color="#2979ff" size="30" @click="download(item)"></u-icon>
        </u-col>
      </u-row>
    </view>
  </view>
</template>

<script>
import {
  PATHROOT,
} from '@/common/path.config';
export default{
  name:"AttachmentUpload",
  props:{
    fileList:{
      type: Array,
      default: () => { return [] },
    }, 
  },
  data(){
    return {
      user: this.$store.state.userInfo,
      fileViewUrl:PATHROOT.STORE + "/common/viewFile",
      downLoadFileUrl: PATHROOT.STORE + "/file/downloadFile",
    };
  },
  computed:{
    imgFileList(){
      return this.fileList.filter(itm => {
        return itm.type != 'pdf';
      });
    },
  },
  created(){
    this.fileViewUrl += "?tk=" + this.user.tk + "&fileId=";
    this.downLoadFileUrl += "?tk=" + this.user.tk + "&fileId=";
  },
  methods:{
    download(item){
      let u = navigator.userAgent;
      let isIos = (!!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/));
      if(isIos && this.$deviceApi.shareContent){
        this.$modal.alert("苹果不支持下载,点击确定后请选择'默认浏览器打开',在默认浏览器中点击底部菜单选择打印","提示", () => {
          this.$deviceApi.shareContent(0, "", this.getAkAppendDownload(item));
        });
      }else{
        this.$modal.downloadFile(this.getAkAppendDownload(item), item.fileName);
      }
    },
    // 预览图片
    doPreviewImage(itm, index) {
      let totalUrlList = [itm, ...this.imgFileList.filter(ip => {
        return ip.id != itm.id;
      }),]; // 数组第一个是 current, 其他数组内容作为 urls
      this.$u.loading("预览图片加载中");
      Promise.all(totalUrlList.map(tUrl => {
        return this.base64ToPathOrToken(tUrl);
      })).then(res => {
        this.$u.hideLoading();
        this.viewPhoto(res);
      });
    },
    // base64转换地址，或者地址增加token
    base64ToPathOrToken(item) {
      return new Promise((resolve, reject) => {
        resolve(this.getAkAppendImg(item));
      });
    },
    getAkAppendImg(item) {
      return this.fileViewUrl + item.id;
    },
    getAkAppendDownload(item) {
      return this.downLoadFileUrl + item.id;
    },
    viewPhoto(totalUrlList) {
      let currUrl = totalUrlList[0];
      let images = totalUrlList.splice(0, 1);
      this.$deviceApi.previewImage(images, currUrl);
    },
    viewFile(item){
      if("pdf,bmp,jpg,png,gif,jpeg".indexOf(item.type) == -1){
        this.$u.toast('文件格式不支持在线预览!');
        return;
      }
      if(item.type != 'pdf'){
        this.doPreviewImage(item);
      }else{
        // 定义跳转参数
        const params = {
          fileId: item.id,
          fileName: item.fileName,
          url: PATHROOT.STORE + "/file/downloadFile",
        };
        this.setRouteParam(params);
        // 跳转详情页面
        this.$u.route("/pages/commonPage/printerComponent");
      }
    },
  },
}
</script>

<style scoped lang="scss">
	.page{
    background-color: #f2f2f3;
    padding: 8rpx 8rpx 0rpx 8rpx;
    margin: 30rpx 0;
    width: 100%;
  }
  .main-content{
    padding: 20rpx 0 20rpx 0;
    border-bottom: 2rpx solid $u-border-color;
  }
  .main-content:last-child{
    padding: 20rpx 0 20rpx 0;
  }
</style>